<template>
  <div id="app">
    <a-space style="display: block">
      <a-button type="primary">按钮</a-button>
      <a-button type="primary" :disabled="true">按钮</a-button>
    </a-space>
    <a-space  style="display: block">
      <a-button type="danger">按钮</a-button>
      <a-button type="danger" :disabled="true">按钮</a-button>
    </a-space >
    <a-space  style="display: block">
      <a-button type="text">按钮</a-button>
      <a-button type="text" :disabled="true">按钮</a-button>
    </a-space>
    <a-space  style="display: block">
      <a-button type="link">按钮</a-button>
      <a-button type="link" :disabled="true">按钮</a-button>
    </a-space>
    <a-space  style="display: block">
      <a-button type="ghost">按钮</a-button>
      <a-button type="ghost" :disabled="true">按钮</a-button>
    </a-space>
    <a-space  style="display: block">
      <a-button type="dashed">按钮</a-button>
      <a-button type="dashed" :disabled="true">按钮</a-button>
    </a-space>
    <a-divider/>

  </div>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'
import {darkTheme, initTheme, lightTheme} from "@/assets/theme/theme";

export default {
  name: 'App',
  components: {
    HelloWorld
  },
  created() {

  },
  methods:{
    dark(){
      console.log(darkTheme)
      initTheme('dark')
      // if(window.less&&window.less.modifyVars){
      //   window.less.modifyVars(darkTheme).then((res)=>{
      //     console.log("切换完成")
      //     initTheme('dark')
      //   })
      // }
    },
    light(){
      console.log(lightTheme)
      initTheme('light')
      // if(window.less&&window.less.modifyVars){
      //   window.less.modifyVars(lightTheme).then((res)=>{
      //     console.log("切换完成")
      //     initTheme('light')
      //   })
      // }
    }
  }
}
</script>

<style lang="less" scoped>
#app {
  width: 100%;
  height: 100%;
}
</style>
